<template>
  <div class="branchSchool">
    <van-pull-refresh v-model="refreshing" @refresh="onRefresh">
      <!--    已报名-->
      <div class="haveSignUp flex-space-center" v-if="is_signup*1>=1">
        <div> 恭喜您，</div>
        <span>成功报名{{school_name?school_name:''}}！</span>
      </div>
      <!--    未报名-->
      <div v-else>
        <!--        下拉刷新上拉加载-->
        <van-list
          v-if="schoolList&&schoolList.length*1>0"
          v-model="loading"
          :finished="finished"
          :offset="20"
          :immediate-check="false"
          finished-text="没有更多了"
          @load="onLoad"
        >
          <!--      分校驿站列表-->
          <div class="schoolList" v-if="isChoosedSchoolShow">
            <div class="listItems flex-start borderBottom"
                 v-for="(item,index) in schoolList"
                 :key="item.id"
                 @click="toSignUp(item)">
              <div class="schoolImg">
                <img :src="item.img" alt="">
              </div>
              <div class="listContent">
                <div class="listTitle oneDot">{{item.school_name}}</div>
                <div v-if="item.address" class="listAddress">{{item.address}}</div>
                <div v-if="item.school_tel" class="listPhone">电话：{{item.school_tel}}</div>
                <div class="listNumber flex-space-between">
                  <div>已报名：{{item.already_num?item.already_num:0}}人</div>
                  <div>{{item.distance?item.distance:0}}KM</div>
                </div>
              </div>
            </div>
          </div>
        </van-list>
      </div>
    </van-pull-refresh>
  </div>
</template>

<script>
  import {ISSINGUP,GETSCHOOLLIST} from "../../../apis/oldUniversity"
  export default {
    components:{
    },
    data() {
      return {
        is_signup:0,// is_signup 是否报名 0未报名 1已报名
        isChoosedSchoolShow:true,//是否选择分校列表
        schoolList:[],//学校列表
        school_name:"",//报名成功的学校名
        position:{},//用户地址
        // 上拉加载下拉刷新配置
        loading: false,//
        finished: false,//上拉加载完毕
        refreshing: false,//下拉刷新
        page:1,//分页页数
        pageSize:10,//每页数据
      }
    },
    mounted() {

    },
    methods:{
      // 去报名
      toSignUp(item){
        this.setsesStore("fullPath", this.$route.fullPath);
        this.$router.push({
          name:"signUp",
          query:{
            title:item.school_name,
            id:item.school_id
          }
        })
      },
      //-------------------------- 接口开始 --------------------
      // 判断是否报名
      isSingup(){
        let isSingup = ISSINGUP
        isSingup().then( res => {
          if(res.data.code*1===200){
            // is_signup 是否报名 0未报名 1已报名
            this.is_signup = res.data.data.is_signup
            this.school_name = res.data.data.school_name;//报名成功的学校名
            if(res.data.data.is_signup*1<1){
              // 获取用户经纬度
              if (this.systemInfo() === "android") {
                this.position = JSON.parse(window.android.getLocationInfo());
              } else if (this.systemInfo() === "ios") {
                window.webkit.messageHandlers.getLocationInfo.postMessage(null);
              }
              // 获取学校列表
              this.getSchoolList()
            }
          } else {
            this.$toast(res.data.message);
          }
        }).catch(error => {
          console.log(error)
        })
      },
      // 获取IOS经纬度
      getIosLocation(position){
        this.position = position
        this.$toast(JSON.stringify( this.position))
      },
      // 获取学校列表
      getSchoolList(){
        let getSchoolList = GETSCHOOLLIST
        let params = {
          type:1,//0 老年大学总校 1分校 目前只传1
          lon:this.position.longitude?this.position.longitude:'116.523852',//经度
          lat:this.position.latitude?this.position.latitude:'39.933697',//纬度
          page:this.page,//页码
        }
        getSchoolList(params).then( res => {
          if(res.data.code*1===200){
            // 下拉刷新
            if (this.refreshing) {
              this.schoolList = [];
              this.refreshing = false;
            }
            this.loading = false;
            const schoolList = res.data.data;//学校列表
            if(schoolList == null || schoolList.length*1 === 0){
              this.finished = true
              return
            }
            if(schoolList.length*1 < this.pageSize){
              this.finished = true
            }
            if(this.page*1 == 1){
              this.schoolList = schoolList
            }else{
              this.schoolList = this.schoolList.concat(schoolList)
            }
            console.log(this.schoolList)
          } else {
            this.$toast(res.data.message);
          }
        }).catch(error => {
          console.log(error)
        })
      },
      // 上拉加载
      onLoad() {
        this.page++;
        this.getSchoolList();//获取学校列表
      },
      // 下拉刷新
      onRefresh() {
        // 清空列表数据
        this.finished = false;

        // 重新加载数据
        // 将 loading 设置为 true，表示处于加载状态
        this.loading = true;
        this.page=1;
        this.getSchoolList();//获取课程列表
      },
      // --------------------------接口结束 -------------------
    },
    watch:{

    }
  }
</script>

<style lang="less" scoped>
  @import (reference) url(../../../assets/less/common);
  .branchSchool{
    width:100%;
    padding:0 0.3rem 0rem 0.3rem;
    box-sizing: border-box;
    .haveSignUp{
      width:100%;
      height: 4rem;
      font-size: @fontSize34;
      font-family: @fontFamily500;
      font-weight: @fontWeight400;
      color:@whiteColor;
      flex-direction: column;
      span{
        font-size: @fontSize30;
      }
    }
    .schoolList{
      width:100%;
      .listItems{
        width:100%;
        padding:0.3rem 0;
        box-sizing: border-box;
        .schoolImg{
          width:2.9rem;
          height: 1.95rem;
          border-radius: 0.1rem;
          margin-right:0.2rem;
          position: relative;
          img{
            max-width: 100%;
            max-height: 100%;
            position: absolute;
            top: 50%;
            left: 50%;
            transform: translate(-50%, -50%);
            border-radius: 0.1rem;
          }
        }
        .listContent{
          flex:1;
          height:1.95rem;
          display: flex;
          align-items: flex-start;
          justify-content: flex-start;
          flex-direction: column;
          div{
            font-size: @fontSize28;
            font-family: @fontFamily400;
            font-weight: @fontWeight400;
            color:rgba(255,255,255,0.8);
            line-height: 0.46rem;
          }
          .listTitle{
            width:3.8rem;
            font-size: @fontSize34;
            font-family: @fontFamily400;
            font-weight: @fontWeight500;
            color:@whiteColor;
            margin-bottom:0.16rem;
          }
          .listNumber{
            width:100%;
          }
        }
      }
      .listItems:nth-last-of-type(1){
        border-bottom: none;
      }
    }
    .borderBottom{
      border-bottom: 0.02rem solid rgba(255,255,255,0.4);
    }
    /deep/.van-overlay{
      z-index:110;
      background:#000000;
    }
  }
</style>
